require('../css/exercise.less');
document.ready(function(){
     window.$$.footer('exercise')
     window.$$.curricular('exercise')
   
     let newCouese=document.querySelector('#newCouese');
     let courses=document.querySelector('#courses');
    
     let userId=JSON.parse(window.localStorage.getItem('user')).userId
//    这是为用户添加数据的调用区域的开始
   addCourse()
  function addCourse(){
  axios.post(window.$$.username+`/sports/saveCourse`,{
     userId:userId,
     courseIds:[3,4,5,6,7]
 
  })
  .then(function(res){
     if(res.data.status===0){
        
          getCourseList()
     }
       
  })
  .catch(function(error){
       console.log(error);
       
  })
  }
   
  //这是获取课程成内容区域的调用函数的开始
  function getCourseList(){
     axios.get(window.$$.username+`/sports/courseList?id=${userId}`)
     .then(function(res){
  let ret=res.data;
         console.log(ret);
         
    
  if(ret.status===0){
  let  renderCourse=ret.data.find(function(v){
          return  v.latest===1;

      })
 let formerCourse=ret.data.filter(function(v){
     return v.latest===0
     })
       showData(renderCourse)
       showData2(formerCourse)
      
  }
          
     })
     .catch(function(error){
     console.log(error);
          
     })
  }
// 这是数据渲染区域的开始(new course);

  function showData(course){
     newCouese.innerHTML+=` <a href="./courdescription.html?courseId=${course.courseId}" class="mt8">
     <img src="${window.$$.username+course.imgurl}" alt="">
     <div class="new_couese_div">
     <p class="p1font mt8 ">${course.name}</p>
     <p class="p2font"> ${course.desc}</p>
     </div>
       </a> `
   };
//这是数据渲染区域的开始二
function showData2(course2){
course2.forEach(function(v){
courses.innerHTML+=`<a href="./courdescription.html?course=${v.courseId}" class="courses_a">
<img src="${window.$$.username+v.imgurl}" alt="">
<div>
<p class="course_span1">${v.name}</p>
<p class="course_span2">${v.desc}</p>
</div>
</a>`
    })
}


})